<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>hello world!</title>
    <script src="https://unpkg.com/xlsx/dist/xlsx.full.min.js"></script>
  </head>
  <body>
    <div>
      <div><input type="file" id="excelFileInput" /></div>
      <div>2</div>
      <div>3</div>
    </div>
    <script>
      function readExcelFile(file) {
        const reader = new FileReader()
        reader.onload = function (e) {
          const data = e.target.result
          const workbook = XLSX.read(data, { type: 'binary' })
          const sheetName = workbook.SheetNames[0] // 获取第一个工作表的名称
          const worksheet = workbook.Sheets[sheetName]
          console.log(sheetName, worksheet)
          const json = XLSX.utils.sheet_to_json(worksheet)
          console.log(json) // 输出转换后的JSON数据
          // 这里你可以进一步处理数据或者进行可视化
        }
        reader.readAsBinaryString(file)
      }

      // 假设你有一个input元素用于上传文件
      const inputElement = document.getElementById('excelFileInput')
      inputElement.addEventListener('change', (e) => {
        const file = e.target.files[0]
        console.log('file-->', file)
        readExcelFile(file)
      })
    </script>
  </body>
</html>
